<template>
  <!-- <div><slot name="slot1"></slot> / <slot name="slot2"></slot></div> -->
  <div class="crumb">
    <span v-for="(item, index) in navs" :key="index">
      <!-- 最后一个高亮颜色 -->
      <span
        :style="{ color: index == navs.length - 1 ? '#33336e' : '#999999' }"
        >{{ item.name }}</span
      >
      <!-- 不显示最后一个/ -->
      <i v-show="index < navs.length - 1">/</i>
    </span>
  </div>
</template>

<script>
export default {
  props: ['navs'],
};
</script>
<style lang="less" scoped>
.crumb {
  margin: 10px 0;
  i {
    padding: 0 5px;
  }
}
</style>
